import * as React from 'react';
import {
    Text, View, TextInput, StyleSheet, Image,
    TouchableOpacity, ScrollView, Switch,
} from 'react-native';
import { WebView } from 'react-native-webview';
export default class MeItem extends React.Component {
    render() {
        return (
            <View style={styles.itemContainer}>
                {/*左面的图片和文字*/}
                <View style={styles.itemHeaderLeft}>
                <Image source={this.props.pic}
                       style={{ width: 20, height: 20,marginRight:10}}/>
                <Text>{this.props.name}</Text>
                </View>
                {/*右面的箭头或开关按钮*/}
                <View>
                    {this._itemRightComponent()}
                </View>
            </View>
        );
    }
    _itemRightComponent(){
          if (this.props.titleName){
              return (
                  <Text style={{ marginRight: 12}}>{this.props.titleName}</Text>
              )
          }
          else {
              return(
                  <Image source={require('../../assets/image/arrow_right_black.png')}
              style={{ width: 20, height: 20, marginRight: 12}}/>
              )
          }
    }
}
const styles = StyleSheet.create({
    itemHeaderLeft:{
        flexDirection:'row',
        alignItems:'center',
        marginLeft:10
    },
    itemContainer:{
        height:40,
        flexDirection:'row',
        backgroundColor:'#FFF',
        alignItems:'center',
        justifyContent:'space-between'
    }
});
//Z自定义组件封装导出
module.exports = MeItem
